package com.example.app.components


import androidx.compose.animation.core.Spring
import androidx.compose.animation.core.animateDpAsState
import androidx.compose.animation.core.spring
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.size
import androidx.compose.material.Icon
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp

@Composable
fun AnimationContent3() {
    var size by remember {
        mutableStateOf(20.dp)
    }
    // 在size变化时产生一个动画
    // Spring.DampingRatioHighBouncy设置动画弹性
    var sizeAnimate = animateDpAsState(targetValue = size, animationSpec = spring(Spring.DampingRatioHighBouncy))
    Column(
        Modifier.fillMaxSize(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        Icon(
            imageVector = Icons.Default.Favorite,
            contentDescription = null,
            tint = Color.Red,
            // clickable(interactionSource = MutableInteractionSource(), indication = null) 去除点击图标后的默认动画
            modifier = Modifier.size(sizeAnimate.value).clickable(interactionSource = MutableInteractionSource(), indication = null) {
                size += 20.dp
            })
    }
}

@Preview(
    showSystemUi = true
)
@Composable
fun AnimationContent3Preview() {
    AnimationContent3()
}

